
var functions = require(__LIBS__ + '/functions')
module.exports = require('angular')
    .module('components.scroller', [
        require(__COMPONENTS__ + '/server/service').name
    ])
    .directive('components.scroller', function () {
        return {
            link: function (scope, element, attr) {
                require.ensure([], () => {
                    var jquery = require('jquery')
                    scope.start(jquery, element)
                })
            },
            controller: 'scroller'
        }
    })
    .controller('scroller', function ($scope, serverservice) {
        var scope = $scope, $, scroller, isScrolling = true, page = 1, maxPage = 5;
        scope.start = function (jquery, element) {
            $ = jquery
            scroller = $(element)
            isScrolling = false

            functions.mouseWheel(function (event, target, direct) {
                if (!isScrolling && serverservice.showMoreServers === false) {
                    scope.scrollAt((function () {
                        if (direct > 0) {
                            return page >= maxPage ? page : (page + 1)
                        } else {
                            return page <= 1 ? page : (page - 1)
                        }
                    })())
                }
            })
        }

        scope.scrollAt = (index) => {
            if (page === index) return;
            isScrolling = !isScrolling
            scroller.animate({
                left: 1920 - index * 1920 + 'px'
            }, 750, function () {
                page = index
                isScrolling = !isScrolling
            })
        }

    })

